/*



// Table of contents //

	1. 	Body
	2.	Custom Container
	3.	Transition Overlay
	4.	Preloader
	5.	Odometer
	6.	Spinner
	7.	Form Elements
	8.	Hamburger Menu
	9.	Ghost Button
	10.	Titles
	11.	Reveal Effects
	12.	Swiper Slider
	13.	Search Box
	14.	Hamburger Menu Box
	15.	Header
	16.	Navbar
	17.	Intro Coddle
	18.	Team Members
	19.	Side Image Content
	20.	Main Features
	21.	Services
	22.	Feeding Coddle
	23.	Recent Works
	24.	All Works
	25.	Clients
	26.	Recent News
	27.	News
	28.	Contact
	29.	Quote Bar
	30.	Footer Bar
	31.	Footer
	32.	Coddle Box
	33.	Responsive Medium Fixes
	34.	Responsive Tablet Fixes
	35.	Responsive Mobile Fixes

*/
/* GOOGLE FONTS */
@import url("https://fonts.googleapis.com/css?family=Fjalla+One|Poppins:300,400,500,600,700,900&subset=latin-ext");
/* BODY */
* { outline: none !important; }

body { font-family: "Poppins"; font-size: 14px; }

body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale; }

body, html { height: 100%; }

/* CUSTOM CONTAINERS */
@media (min-width: 1200px) { .container { max-width: 1220px; } }
/* HTML ELEMENTS */
img { max-width: 100%; }

/* TRANSITION OVERYLAY */
.transition-overlay { width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: #99a4be; opacity: 0; visibility: hidden; transition-duration: 700ms; -webkit-transition-duration: 700ms; transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); z-index: 99; }
.transition-overlay.show-me { opacity: 1; visibility: visible; }

/* PRELOADER */
.preloader { width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 9999999; background: #99a4be; }

.preloader { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transform: all 0.4s ease; transition: all 0.4s ease; transition-delay: 1s; }

.page-loaded .preloader { transform: translateY(-100%); }

/* ODOMETER */
.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-car .odometer-digit { padding: 0; }

.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-car .odometer-digit .odometer-digit-inner { left: 0; }

/* SPINNER */
.spinner { -webkit-animation: rotate 2s linear infinite; animation: rotate 2s linear infinite; z-index: 2; position: absolute; top: 50%; left: 50%; margin: -25px 0 0 -25px; width: 50px; height: 50px; }

.spinner .path { stroke: #fff; stroke-linecap: round; -webkit-animation: dash 1.5s ease-in-out infinite; animation: dash 1.5s ease-in-out infinite; }

/* FORM ELEMENTS */
input[type="text"],input[type="email"]{ width: 100%; height: 52px; float: left; border: 1px solid #eee; padding: 0 20px; }
select.customselect{width: 100%; height: 52px; float: left; border: 1px solid #eee; padding: 0 20px;}
select.customselect2 {width: 100%;height: 40px;border: 1px solid #eee;padding: 0 20px;}
textarea { width: 100%; height: 143px; float: left; border: 1px solid #eee; padding: 20px;resize: none;}

button[type="submit"] { height: 52px; display: inline-block; border: none; background: #f3a712; border-radius: 52px; padding: 0 40px; color: #fff; font-weight: 600;cursor:pointer;}

/* HAMBURGER MENU */
.hamburger-menu { width: 46px; height: 46px; float: right; position: relative; cursor: pointer; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); transition-duration: 500ms; -webkit-transition-duration: 500ms; transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1); border-radius: 50%; }
.hamburger-menu span { display: block; height: 2px; width: 22px; background: #fff; opacity: 1; position: absolute; right: 12px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
.hamburger-menu span:nth-child(1) { top: 15px; width: 12px; right: 17px; }
.hamburger-menu span:nth-child(2) { top: 22px; }
.hamburger-menu span:nth-child(3) { top: 29px; width: 12px; right: 17px; }
.hamburger-menu:hover span { width: 22px; right: 12px; }
.hamburger-menu.open span:nth-child(1) { top: 22px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
.hamburger-menu.open span:nth-child(2) { opacity: 0; right: -10px; }
.hamburger-menu.open span:nth-child(3) { top: 22px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); }

/* GHOST BUTTON */
.ghost-btn { position: relative; display: inline-block; width: 217px; height: 50px; font-weight: 600; line-height: 60px; text-align: center; text-transform: uppercase; background-color: transparent; cursor: pointer; text-decoration: none; }
.ghost-btn svg { width: 217px; height: 62px; position: absolute; top: 0; left: 0; }
.ghost-btn svg rect { width: 206px; height: 50px; stroke-width: 2; stroke-dasharray: 353, 0; stroke-dashoffset: 0; -webkit-transition: all 600ms ease; transition: all 600ms ease; }
.ghost-btn span { background: #072544; background: -moz-linear-gradient(left, #072544 0%, #12519c 100%); background: -webkit-linear-gradient(left, #072544 0%, #12519c 100%); background: linear-gradient(to right, #072544 0%, #12519c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#072544', endColorstr='#12519c',GradientType=1 ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

.ghost-btn:hover svg rect { stroke-width: 2; stroke-dasharray: 156, 505; stroke-dashoffset: 427; }

.ghost-btn:hover { text-decoration: none; }

/* TITLES */
.titles { width: 100%; float: left; text-align: center; }
.titles .title-bg { width: 160px; height: 134px; display: inline-block; background: url(../images/title-bg.png) no-repeat; background-size: cover; margin-bottom: -93px;opacity: 0.5;}
.titles h6 { font-family: "Fjalla One"; font-size: 13px; background: #fed20f; background: -moz-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: -webkit-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: linear-gradient(135deg, #fed20f 0%, #ed9923 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fed20f', endColorstr='#ed9923',GradientType=1 ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-transform: uppercase; }
.titles h3 { font-weight: 600; font-size: 52px; font-weight: 600; letter-spacing: -2px; margin-bottom: 40px; background: #fed20f; background: -moz-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: -webkit-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: linear-gradient(135deg, #fed20f 0%, #ed9923 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fed20f', endColorstr='#ed9923',GradientType=1 ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

/* REVEAL EFFECT */
.reveal-effect { float: left; overflow: hidden; position: relative; }

/* MAIL SUCCESS*/
.successmail h2 {font-size: 30px;margin-bottom: 10px;}
.successmail h2 span {color: #F3A712;}
.successmail .custom-btn { height: 40px;line-height: 42px;background: #f3a712;padding: 10px 26px;border-radius: 40px;margin-top: 6px;color: #fff;font-size: 13px;font-weight: 600;text-decoration: none;}
.successmail .custom-btn:hover {background: #212529;color: #fff;}
/* SWIPER SLIDER */
.swiper-slider { width: 100%; float: left; position: relative; overflow: hidden; }
.swiper-slider .swiper-wrapper { width: 100%; float: left; }

/* SEARCH BOX */
.search-box { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-content: center; background: #99a4be; position: fixed; left: 0; top: 0; opacity: 0; visibility: hidden; z-index: 5; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
.search-box .inner { width: 100%; float: left; padding: 30px calc(25vw - 50px); }
.search-box .inner h4 { display: block; text-align: center; font-weight: 700; color: #fff; margin-bottom: 30px; font-size: 40px; }
.search-box .inner form { width: 100%; height: 60px; float: left; border: 2px solid #fff; border-radius: 60px; }
.search-box .inner form input[type="text"] { width: calc(100% - 150px); height: 56px; float: left; background: none; border: none; padding: 0 30px; font-size: 15px; color: #fff; font-weight: 600; }
.search-box .inner form input[type="text"]::-webkit-input-placeholder { color: #fff; }
.search-box .inner form input[type="text"]::-moz-placeholder { color: #fff; }
.search-box .inner form input[type="text"]:-ms-input-placeholder { color: #fff; }
.search-box .inner form input[type="text"]:-moz-placeholder { color: #fff; }
.search-box .inner form button[type="submit"] { width: 130px; height: 46px; float: right; border-radius: 50px; background: #fcc50f; border: none; margin: 5px; box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.1); }
.search-box.show-me { opacity: 1; visibility: visible; }

/* HAMBURGER MENU BOX */
.hamburger-menu-box {width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;align-content: center;background: #153357;position: fixed;left: 0;top: 0;opacity: 0;visibility: hidden;z-index: 5;-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-ms-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;text-align: center;padding-top: 86px;}
.hamburger-menu-box .menu { width: 100%; float: left; padding: 30px calc(25vw - 50px); display: none; }
.hamburger-menu-box .menu .navbar-nav { width: 100%; float: left; margin: 0; padding: 0; text-align: left; }
.hamburger-menu-box .menu .navbar-nav .nav-item { width: 100%; float: left; margin: 0; padding: 0; list-style: none; }
.hamburger-menu-box .menu .navbar-nav .nav-item ul { width: 100%; float: left; margin-bottom: 10px; padding: 0; display: none; }
.hamburger-menu-box .menu .navbar-nav .nav-item ul li { width: 100%; float: left; margin: 0; padding: 0; list-style: none; }
.hamburger-menu-box .menu .navbar-nav .nav-item ul li a { width: 100%; float: left; font-size: 15px; color: #fff; }
.hamburger-menu-box .menu .navbar-nav .nav-item ul li a:hover { text-decoration: none; }
.hamburger-menu-box .menu .navbar-nav .nav-item .nav-link { width: 100%; float: left; font-size: 17px; font-weight: 600; color: #fff; }
.hamburger-menu-box .inner { width: 100%; float: left; padding: 30px calc(25vw - 50px); display: block; }
.hamburger-menu-box .inner .swiper-slider { width: 60%; margin: 0 20%; margin-bottom: 20px; border: 5px solid #fff; }
.hamburger-menu-box .inner .swiper-slider .swiper-pagination-bullet-active { background: #fed20f; }
.hamburger-menu-box .inner .lead { color: #fff; }
.hamburger-menu-box .inner .ghost-btn span { background: none; -webkit-text-fill-color: #ffffff; }
.hamburger-menu-box.show-me { opacity: 1; visibility: visible; }

/* HEADER */
.header {width: 100%;height: 100vh;float: left;background: #153357;background: -webkit-linear-gradient(-45deg, #153357 0%,#02203e 100%);background: linear-gradient(-45deg, #153357 0%,#02203e 100%);overflow: hidden;position: relative;}
.header .demos { width: 100%; float: left; margin-top: 15%; }
.header .demos a { width: 100%; float: left; border: 5px solid #fff; }
.header .demos a:hover { border: 5px solid #fed20f; }
.header .demos h6 { width: 100%; float: left; font-size: 13px; font-weight: 600; color: #fff; margin-top: 10px; margin-bottom: 30px; text-align: center; }
.header #particles-bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden; }
.header .video-bg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; overflow: hidden; }
.header .video-bg video { min-width: 100%; min-height: 100%; float: left; opacity: 0.2; }
.header .inner { width: 40%; position: absolute; left: 5%; top: 32%; z-index: 3; }
.header .inner h2 {font-size: 5em;font-weight: 700;color:#fefefe;font-family: "Fjalla One";}
.header .inner p { color: #fff; line-height: 26px; margin-bottom: 50px; }
.header .inner .text-yellow {color: #F3A712;}
.header .inner .custom-btn {height: 40px;line-height: 42px;background: #fff;padding:15px;border-radius: 40px;margin-top: 6px;color: #153357;font-size: 14px;font-weight: 600;}
.header .inner .custom-btn:hover {text-decoration: none;background: #F3A712;color: #fff;}
.navbar .custom-btn.active {text-decoration: none;background: #F3A712!important;color: #fff!important;}
.header .inner .ghost-btn span { background: none; -webkit-text-fill-color: #ffffff; }
.header .isolayer { z-index: 1; transform: translateX(40vw) translateY(-340px) rotateX(45deg) rotateZ(37deg) !important; }
.header.int-header { width: 100%; height: 270px;overflow:visible;}
.header.int-header .inner { width: 100%; left: 0;}
.header.int-header .inner h2 {font-size: 2.4em;}
.header.int-header .inner h6 { color: #fff; object-fit: 0.7; }

.topbar {background-color: #021426;position: relative;z-index: 9;width: 90%;clip-path: polygon(0 0, 75% 0, 72.1% 100%, 0 100%);border-bottom-right-radius: 22px 167%;border-top-right-radius: 0px 0% !important;}
@media only screen and (max-width : 768px) {.topbar {display:none;}}
.top-contact {padding: 4px;}
.topbar .single-contact, .topbar .single-contact a {color: #ffffff;font-weight: normal;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;font-size: 14px;}
.topbar .single-contact {display: inline-block;margin-right: 25px;color: #ffffff;cursor: pointer;}
.topbar .single-contact i {color: #f3a712;margin-right: 10px;font-size: 18px;position: relative;top: 2px;}
.topbar-right {position: relative;float: right;}
.topbar .social-icons {float: left;margin-right: 20px;}
.topbar .social-icons li {display: inline-block;margin-right: 10px;padding-bottom:.25rem;}
.topbar .social-icons .social-text{color: #ffffff;}
.topbar .social-icons li a {color: #fff;display: block;font-size: 15px;text-align: center;background:rgb(12 42 75);line-height: 0;border: none;padding: 7px 0;width: 28px;height: 28px;transition: 0.3s ease 0s;border-radius: 100%;}
.topbar .social-icons li a:hover {color: #F3A712;background: #fff;transform: rotate(360deg);}

/* NAVBAR */
.navbar { width: 100%; float: left; display: block; padding: 15px 4%; padding-top: 20px; text-align: center; position: relative; z-index: 9; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; background: url(../images/rainbow-bar.png) top repeat-x; background-size: auto 5px;}
.navbar:after { content: ""; width: 70%; height: 1px; background: #fff; opacity: 0.2; position: absolute; left: 15%; bottom: 0; }
.navbar.stick-me { position: fixed; background: url(../images/rainbow-bar.png) top repeat-x #fff; background-size: auto 5px; z-index: 9;box-shadow: 0 3px 12px 0 rgba(0, 0, 0, 0.1);}
.navbar.stick-me .logo .logo-colored { display: block !important; }
.navbar.stick-me .logo .logo-light { display: none; }
.navbar.stick-me .navbar-nav .nav-item .nav-link {color: #212529;}
.navbar.stick-me .search-btn { background: #99a4be; -webkit-mask-image: url(../images/search-icon.svg); mask-image: url(../images/search-icon.svg); }
.navbar.stick-me .custom-btn {background: #212529;color: #fff;}
.navbar.stick-me .hamburger-menu span { background: #99a4be; }
.navbar .logo { float: left; }
.navbar .logo .logo-colored { display: none; }
.navbar .logo a { float: left; }
.navbar .logo a img { float: left; height: 50px; }
.navbar .hamburger-menu { float: right; margin-left: 5px; margin-top: 2px; }
.navbar .search-btn { float: right; width: 32px; height: 32px; background: #fff; -webkit-mask-image: url(../images/search-icon.svg); mask-image: url(../images/search-icon.svg); margin-top: 8px; margin-left: 20px; cursor: pointer; }
.navbar .search-btn img { width: 34px; }
.navbar .custom-btn {float: right;height: 40px;line-height: 42px;background: #fff;padding: 0 35px;border-radius: 40px;margin-top: 6px;color: #153357;font-size: 13px;font-weight: 600;}
.navbar .custom-btn:hover { text-decoration: none; background: #F3A712; color: #fff; }
.navbar .navbar-nav { height: 45px; line-height: 52px; display: inline-block; margin-left: 50px; position: relative; z-index: 2; }
.navbar .navbar-nav .nav-item { float: left; margin: 0 5px; padding: 0 5px; position: relative; }
.navbar .navbar-nav .nav-item ul { width: 242px; margin: 0; padding: 10px 0; position: absolute; left: 0; top: calc(100% + 12px); background: #fff; text-align: left; box-shadow: 0 0 40px rgba(0, 0, 0, 0.05); opacity: 0; visibility: hidden; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
.navbar .navbar-nav .nav-item ul:before { content: ""; width: 100%; height: 13px; position: absolute; left: 0; top: -13px; }
.navbar .navbar-nav .nav-item ul li { width: 100%; float: left; line-height: 36px; margin: 0; padding: 0; list-style: none; padding: 0 15px; }
.navbar .navbar-nav .nav-item ul li a { width: 100%; float: left; color: #212529; font-size: 13px; font-weight: 600; }
.navbar .navbar-nav .nav-item ul li a:hover { text-decoration: none; color: #f3a712; }
.navbar .navbar-nav .nav-item .nav-link { padding: 0 10px; font-weight: 600; font-size: 13px; color: #fff; border-bottom: 1px solid transparent; }
.navbar .navbar-nav .nav-item .active {color:#f3a712!important;}
.navbar .navbar-nav .nav-item .nav-link:hover { text-decoration: none; color: #f3a712; }
.navbar .navbar-nav .nav-item .nav-link:before { content: ''; display: block; position: absolute; left: 0; bottom: -13px; height: 1px; width: 0; transition: width 0s ease, background .25s ease; }
.navbar .navbar-nav .nav-item .nav-link:after { content: ''; display: block; position: absolute; right: 0; bottom: -13px; height: 1px; width: 0; background: #fff; transition: width .25s ease; }
.navbar .navbar-nav .nav-item .nav-link:hover:before { width: 100%; background: #fff; transition: width .25s ease; }
.navbar .navbar-nav .nav-item .nav-link:hover:after { width: 100%; background: transparent; transition: all 0s ease; }
.navbar .navbar-nav .nav-item:hover ul { opacity: 1; visibility: visible; }

/* INTRO CODDLE */
.intro-techius { width: 100%; display: flex; text-align: center; padding: 60px 0; }
.intro-techius .article { width: 100%; float: left; }
.intro-techius .article p { line-height: 23px; margin-bottom: 15px; opacity: 0.8; }
.intro-techius .ghost-btn { margin-top: 30px; }

/* TEAM MEMBERS */
.team-members { width: 100%; display: flex; text-align: center; padding-top: 60px; border-top: 1px solid #eee; }
.team-members figure { width: 100%; float: left; position: relative; margin: 0; }
.team-members figure img { width: 100%; float: left; }
.team-members figure figcaption { width: 100%; height: 100%; flex: 1; display: flex; flex-direction: column; justify-content: center; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.7); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; opacity: 0; }
.team-members figure figcaption h4 { color: #fff; margin: 0; }
.team-members figure figcaption span { color: #fff; font-size: 12px; font-weight: 600; opacity: 0.7; }
.team-members figure:hover figcaption { opacity: 1; }

/* SIDE IMAGE CONTENT */
.side-image-content { width: 100%; display: flex; flex-direction: row; align-items: center;padding-top:30px; }
.side-image-content .side-image { flex-basis: 50%; display: flex; }
.side-image-content .side-image .left { flex-basis: 60%; padding-right: 30px; }
.side-image-content .side-image .left .small-image { width: 70%; margin-top: 30px; float: right; }
.side-image-content .side-image .right { flex-basis: 40%; padding-top: 140px; }
.side-image-content .side-image .no-spacing { padding: 0; }
.side-image-content .side-content { flex: 1; flex-basis: 50%; flex-direction: column; padding: 0 calc(25vw - 270px); }
.side-image-content .side-content .titles { text-align: left; }
.side-image-content .side-content p { line-height: 26px; margin-bottom: 22px;}
.side-image-content .side-content .ghost-btn { margin-top: 20px; }

.breadcrumbs{background-image: linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.25)), url('../images/1.jpg'); background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;padding:27px 0;margin-top:34px}
.breadcrumbs .bread-menu{color:#fff;position:relative;line-height:initial;font-size:0}
.breadcrumbs .bread-title{position:relative;border-radius: 0px;}
.breadcrumbs ul li{display:inline-block}
.breadcrumbs .bread-menu li+li::before{content:"\f105";font-family:FontAwesome;left:-7px;position:relative;font-size:18px}
.breadcrumbs .bread-menu li:last-child{margin:0;padding:0}
.breadcrumbs .bread-menu li a{color:#fff;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;font-size:18px;font-weight:500;padding-right:8px;margin-right:8px;display:inline-block}
.breadcrumbs ul li a{text-transform:capitalize}
.bread-title h2{color:#f3a712!important}
ul.bullets{line-height:1.8;margin-bottom:0;padding-inline-start:10px;margin-top:10px;list-style-type:none}
ul.bullets li{position:relative;margin-bottom:9px;padding-left:19px;line-height:22px}
ol.bullets-ol li ul.bullets li:before,ul.bullets li:before,ul.map-list li ul.bullets li:before{content:"\f101"!important;font-family:FontAwesome;font-size:16px;color:#f3a712;position:absolute;left:0;font-weight:600;line-height:20px;top:0}
section.portfolio{padding-bottom:60px}
.top-benefits{width:100%}
.top-benefits{position:relative;display:inline-block;padding:24px;margin-top:12px;overflow:hidden;border:1.5px solid #0c2a4c;-webkit-box-shadow:0 5px 20px rgba(0,0,0,.1);-moz-box-shadow:0 5px 20px rgba(0,0,0,.1);box-shadow:0 5px 20px rgba(0,0,0,.1);-webkit-transition:all .4s ease;-moz-transition:all .4s ease;transition:all .4s ease;    background-size: 100% 200%;
    background-image: linear-gradient(to bottom, #ffffff 50%, #0c2a4c 50%);}

.top-benefits:hover{transform:scale(1.03); background-position: 0 -100%;color:#ffffff;}
.top-benefits-img{text-align:center;margin-bottom:16px}
.top-benefits-img img{padding:0;border:1px solid #fff;border-radius:50%;width:70px}
.top-benefits p{text-align:center;margin-top:10px}

/* SIDE STICKY MENU */
.side-sticky{clear:both;position:fixed;display:block;list-style-type:none;right:3.2em;top:45%;padding: 0px;-webkit-animation:slideright 1s forwards;-webkit-animation-delay:1.5s;animation:slideright 1s forwards;animation-delay:1.5s;z-index:1000}
@keyframes slideright{100%{right:0}}
.side-sticky li{margin-bottom:40px;margin-right:-43px;padding:10px;text-align:center;-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);background-color:#f3a712;box-shadow:0 3px 12px 0 rgba(0,0,0,.1);border-top-left-radius:10px;border-top-right-radius:10px;-webkit-transition:width .5s,background-color .1s;transition:width .5s,background-color .1s}
.side-sticky li a{text-transform:none;text-align:center;text-decoration:none;color:#ebebeb}
.side-sticky li:hover{background-color:#ab7100;color:#fff}
 @media (max-width: 767px) { .side-sticky {display:none}}


/* MAIN FEATURES */
.main-features {width: 100%;display: flex;background: #153357;padding-bottom: 80px!important;padding-top: 30px;}
.main-features .titles { display: block; }
.main-features .titles .title-bg { mix-blend-mode: color-dodge; }
.main-features .titles h3 { -webkit-text-fill-color: #fff; }
.main-features .feature-box i{font-size: 3em;text-align: center;background: rgb(12 42 75);width: 80px;height: 80px;line-height: 1.5;border: none;padding: 7px 0;transition: 0.3s ease 0s;border-radius: 100%;}
.main-features .feature-box i:hover{background:#ffffff;color:#f3a712!important;}
.main-features .feature-box { width: 100%; padding: 50px 40px; box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.1); position: relative; text-align: center; color: #fff; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; background: url(../images/1.jpg) center no-repeat; background-size: cover;margin-bottom: 29px;}
.main-features .feature-box:hover { box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.3);transform: scale(1.03);}
.main-features .feature-box h5 a:hover .feature-box i{background:#ffffff!important;color:#f3a712!important;}
.main-features .feature-box figure { height: 60px; margin-bottom: 30px; }
.main-features .feature-box figure img { width: 60px; }
.main-features .feature-box t span { width: 70%; height: 1px; float: lef; margin: 0 15%; margin-bottom: 40px; background: #fff; opacity: 0.3; }
.main-features .feature-box h5 { font-weight: 600; margin-bottom: 20px; font-size: 13px; }
.main-features .feature-box h5 a{color: #fed20f;font-size: 14px;}
.main-features .feature-box p { line-height: 22px; font-size: 14px; margin: 0; }
.main-features .feature-box .more-link { width: 37px; height: 37px; text-align: right; font-size: 17px; color: #fff; position: absolute; right: -4px; bottom: -4px; z-index: 2; line-height: 50px; padding-right: 5px; }
.main-features .feature-box .more-link:hover { text-decoration: none; }
.main-features .feature-box .more-link:after { content: ""; width: 0; height: 0; border-style: solid; border-width: 0 0 37px 37px; border-color: transparent transparent #fed20f transparent; position: absolute; right: 0; bottom: 0; z-index: -1; }
.main-features .feature-box ul { width: 100%; margin-top: 20px; margin-bottom: 0; padding: 0; display: none; }
.main-features .feature-box ul li { width: 100%; margin-bottom: 4px; padding: 0; list-style: none; font-weight: 600; font-size: 12px; }
.main-features .feature-box ul li span { color: #fff; }
.main-features .feature-box ul li span img { width: 12px; margin-right: 4px; }

/* SERVICES */
.services { width: 100%; display: flex; padding: 60px 0; }
.services .service-box { width: 100%; padding: 50px 40px; box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.1); position: relative; color: #fff; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; background: url(../images/1.jpg) center no-repeat; background-size: cover; margin-bottom: 30px; }
.services .service-box:hover { box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.3); }
.services .service-box figure { width: 60px; float: left; margin-right: 20px; margin-bottom: 30px; }
.services .service-box figure img { width: 60px; }
.services .service-box span { width: 1px; height: 80px; float: left; margin-right: 20px; background: #fff; opacity: 0.3; }
.services .service-box h5 { font-weight: 600; margin-bottom: 20px; font-size: 13px; }
.services .service-box p { line-height: 22px; font-size: 14px; margin: 0; }
.services .service-box .more-link { width: 37px; height: 37px; text-align: right; font-size: 17px, color: #fff; position: absolute; right: -4px; bottom: -4px; z-index: 2; line-height: 50px; padding-right: 5px; }
.services .service-box .more-link:hover { text-decoration: none; }
.services .service-box .more-link:after { content: ""; width: 0; height: 0; border-style: solid; border-width: 0 0 37px 37px; border-color: transparent transparent #57c199 transparent; position: absolute; right: 0; bottom: 0; z-index: -1; }
.services .service-box ul { width: 100%; margin-top: 20px; margin-bottom: 0; padding: 0; padding-left: 100px; display: none; }
.services .service-box ul li { width: 100%; margin-bottom: 4px; padding: 0; list-style: none; font-weight: 600; font-size: 12px;}
.services .service-box ul li a { color: #fff;}
.services .service-box ul li a img { width: 12px; margin-right: 4px; }

/* SOLUTIONS */
.solutions { width: 100%; display: flex; padding: 60px 0; }
.solutions .custom-btn {float: left;height: 40px;line-height: 42px;background:#f3a712;padding: 0 35px;border-radius: 40px;margin-top: 6px;color: #fff;font-size: 13px;font-weight: 600;text-decoration:none;}
.solutions .custom-btn:hover{ background: #212529;color: #fff;}

/* CAREERS */
.careers { width: 100%; display: flex; padding: 60px 0; }
.careers .custom-btn {float: left;height: 40px;line-height: 42px;background:#f3a712;padding: 0 35px;border-radius: 40px;margin-top: 6px;color: #fff;font-size: 13px;font-weight: 600;text-decoration:none;}
.careers .custom-btn:hover{ background: #212529;color: #fff;}
.careers i{font-size: 45px;color:#f3a712;}
/* FEEDING CODDLE */
.feeding-techius { width: 100%; display: flex; text-align: center; padding: 60px 0; background: #f1f5fd; color: #99a4be; }
.feeding-techius i{vertical-align: middle;font-size: 50px;}
.feeding-techius figure { width: 100%; margin-bottom: 0; }
.feeding-techius figure img { height: 70px; margin-bottom: 20px; }
.feeding-techius .odometer { font-family: "Fjalla One"; font-size: 40px; margin-bottom: 15px; }
.feeding-techius h6 { font-weight: 600; font-size: 14px; color: #f3a712; text-transform: uppercase; }

/* RECENT WORKS */
.recent-works { width: 100%; float: left;text-align: center;padding-bottom: 80px;padding-top: 20px;padding-left: 10px;padding-right: 10px;overflow:hidden;}
.recent-works h6 { font-family: "Fjalla One"; font-size: 13px; }
.recent-works h3 { font-weight: 600; font-size: 52px; font-weight: 600; letter-spacing: -2px; margin-bottom: 50px; }
.recent-works .works-filter { display: inline-block; margin-bottom: 20px; padding: 0; }
.recent-works .works-filter li { float: left; margin: 0; padding: 0; list-style: none;border-right: 1.5px solid #cccccc9e;}
.recent-works .works-filter li:last-child {margin-right: 0px;padding-right: 0px;border: none;}
.recent-works .works-filter li a {float: left;padding: 0 10px;color: #212529;font-weight: 600;font-size: 13px;}
.recent-works .works-filter li a.current { color: #fed20f; }
.recent-works .works-filter li a:hover { text-decoration: none; }
.recent-works .works-grid { width: 100%; float: left; margin: 0; padding: 0; }
.recent-works .works-grid li { width: auto; float: none; margin: 0; padding: 0; list-style: none; }

/* ALL WORKS */
.all-works { width: 100%; float: left; padding: 60px 0; text-align: center;padding-left: 10px;padding-right: 10px;overflow:hidden;}
.all-works h6 { font-family: "Fjalla One"; font-size: 13px; }
.all-works h3 { font-weight: 600; font-size: 52px; font-weight: 600; letter-spacing: -2px; margin-bottom: 50px; }
.all-works .works-filter { display: inline-block; margin-bottom: 20px; padding: 0; }
.all-works .works-filter li { float: left; margin: 0; padding: 0; list-style: none; border-right: 1.5px solid #cccccc9e;}
.all-works .works-filter li:last-child {margin-right: 0px;padding-right: 0px;border: none;}
.all-works .works-filter li a { float: left; padding: 0 10px; color: #99a4be; font-weight: 600; font-size: 13px; }
.all-works .works-filter li a.current { color: #fed20f; }
.all-works .works-filter li a:hover { text-decoration: none; }
.all-works .works-grid { width: 100%; float: left; margin: 0; padding: 0; }
.all-works .works-grid.spaced li { padding: 15px; }
.all-works .works-grid.retro li { width: 33.33333%; }
.all-works .works-grid li { width: auto; float: none; margin: 0; padding: 0; list-style: none; }

/* CLIENTS */
.clients { width: 100%; float: left; text-align: center; }
.clients.spacing { padding: 60px 0; }
.clients ul { width: 100%; float: left; margin: 0; padding: 0; }
.clients ul li { width: 16.66666%; float: left; margin: 0; margin-left: -1px; padding: 20px; border: 1px solid #eee; list-style: none; -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -ms-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
.clients ul li:hover { box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.1); position: relative; z-index: 2; }

/* RECENT NEWS */
.recent-news { width: 100%; float: left; padding: 100px 0; }
.recent-news .news-box { width: 100%; float: left; box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.1); }
.recent-news .news-box figure { width: 100%; float: left; margin-bottom: 0; }
.recent-news .news-box .news-content { width: 100%; float: left; padding: 30px; }
.recent-news .news-box .news-content small { display: block; font-size: 10px; opacity: 0.5; margin-bottom: 10px; }
.recent-news .news-box .news-content h3 { display: block; font-size: 19px; font-weight: 700; line-height: 28px; margin-bottom: 20px; background: #fed20f; background: -moz-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: -webkit-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: linear-gradient(135deg, #fed20f 0%, #ed9923 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fed20f', endColorstr='#ed9923',GradientType=1 ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.recent-news .news-box .news-content p { opacity: 0.8; line-height: 26px; }
.recent-news .news-box .news-content a { font-size: 12px; font-weight: 700; color: #fed20f; padding-bottom: 6px; position: relative; }
.recent-news .news-box .news-content a:hover { text-decoration: none; }
.recent-news .news-box .news-content a:before { content: ''; display: block; position: absolute; left: 0; bottom: 0; height: 2px; width: 0; transition: width 0s ease, background .25s ease; }
.recent-news .news-box .news-content a:after { content: ''; display: block; position: absolute; right: 0; bottom: 0; height: 2px; width: 0; background: #fed20f; transition: width .25s ease; }
.recent-news .news-box .news-content a:hover:before { width: 100%; background: #fed20f; transition: width .25s ease; }
.recent-news .news-box .news-content a:hover:after { width: 100%; background: transparent; transition: all 0s ease; }

/* CHOOSE US */
.chooseus { width: 100%; display: flex;padding-bottom:60px;}
.chooseus .play-btn{width:94px;height:94px;background:radial-gradient(#f3a712 50%,rgb(255 193 7 / 33%) 52%);border-radius:50%;display:block;position:absolute;left:calc(50% - 47px);top:calc(50% - 47px);overflow:hidden}
.chooseus .play-btn::after{content:'';position:absolute;left:50%;top:50%;transform:translateX(-40%) translateY(-50%);width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:15px solid #fff;transition:all .4s cubic-bezier(.55,.055,.675,.19)}
.chooseus .play-btn::before{content:'';position:absolute;width:120px;height:120px;-webkit-animation-delay:0s;animation-delay:0s;-webkit-animation:pulsate-btn 2s;animation:pulsate-btn 2s;-webkit-animation-direction:forwards;animation-direction:forwards;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:steps;animation-timing-function:steps;opacity:1;border-radius:50%;border:5px solid rgb(243,167,18,.7);top:-15%;left:-15%;background:rgba(198,16,0,0)}
.chooseus .play-btn:hover::after{border-left:15px solid #f3a712;transform:scale(20)}
.chooseus .play-btn:hover::before{content:'';position:absolute;left:50%;top:50%;transform:translateX(-40%) translateY(-50%);width:0;height:0;border:none;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:15px solid #fff;z-index:200;-webkit-animation:none;animation:none;border-radius:0}@-webkit-keyframes pulsate-btn{0%{transform:scale(.6,.6);opacity:1}100%{transform:scale(1,1);opacity:0}}@keyframes pulsate-btn{0%{transform:scale(.6,.6);opacity:1}100%{transform:scale(1,1);opacity:0}}
.chooseus .watchus:before{content:"";position:absolute;left:0;top:-25px;border-left:14px solid transparent;border-top:12px solid transparent;border-bottom:13px solid #99a4be}
.chooseus .watchus{display:block;text-align:left;padding:10px 10px;opacity:1;position:absolute;z-index:1;font-size:16px;background:#153357;color:#fff;left:1px;transform:inherit;font-weight:500;top:10%;margin-top:-22px}
/* NEWS */
.news { width: 100%; display: flex; padding: 100px 0; }
.news .news-box { width: 100%; float: left; box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.1); margin-bottom: 50px; }
.news .news-box figure { width: 100%; float: left; margin-bottom: 0; }
.news .news-box figure img { width: 100%; float: left; }
.news .news-box .news-content { width: 100%; float: left; padding: 30px; }
.news .news-box .news-content small { display: block; font-size: 10px; opacity: 0.5; margin-bottom: 10px; }
.news .news-box .news-content h3 { display: block; font-size: 19px; font-weight: 700; line-height: 28px; margin-bottom: 20px; background: #fed20f; background: -moz-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: -webkit-linear-gradient(-45deg, #fed20f 0%, #ed9923 100%); background: linear-gradient(135deg, #fed20f 0%, #ed9923 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fed20f', endColorstr='#ed9923',GradientType=1 ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.news .news-box .news-content p { opacity: 0.8; line-height: 26px; }
.news .news-box .news-content ul { display: block; padding-left: 20px; }
.news .news-box .news-content ul li { margin: 0; padding: 4px 0; opacity: 0.8; }
.news .news-box .news-content blockquote { padding: 15px 25px; border-left: 5px solid #fed20f; background: #fffced; }
.news .news-box .news-content blockquote p { margin: 0; }
.news .news-box .news-content a { font-size: 12px; font-weight: 700; color: #fed20f; padding-bottom: 6px; position: relative; }
.news .news-box .news-content a:hover { text-decoration: none; }
.news .news-box .news-content a:before { content: ''; display: block; position: absolute; left: 0; bottom: 0; height: 2px; width: 0; transition: width 0s ease, background .25s ease; }
.news .news-box .news-content a:after { content: ''; display: block; position: absolute; right: 0; bottom: 0; height: 2px; width: 0; background: #fed20f; transition: width .25s ease; }
.news .news-box .news-content a:hover:before { width: 100%; background: #fed20f; transition: width .25s ease; }
.news .news-box .news-content a:hover:after { width: 100%; background: transparent; transition: all 0s ease; }
.news .news-sidebar { width: 100%; float: left; padding-left: 60px; }
.news .news-sidebar .widget { width: 100%; float: left; margin-bottom: 20px; position: relative; }
.news .news-sidebar .widget .title { display: block; margin-bottom: 15px; font-size: 22px; font-weight: 700; color: #99a4be; }
.news .news-sidebar .widget p { font-size: 13px; line-height: 20px; opacity: 0.7; }
.news .news-sidebar .widget form { width: 100%; float: left; border: 1px solid #eee; padding: 4px; border-radius: 50px; }
.news .news-sidebar .widget form input[type="text"] { width: calc(100% - 60px); height: 40px; border: none; padding: 0 15px; background: none; }
.news .news-sidebar .widget form button { width: 60px; height: 40px; padding: 0; }
.news .news-sidebar .widget .tags { width: 100%; float: left; margin: 0; padding: 0; }
.news .news-sidebar .widget .tags li { float: left; margin-right: 6px; margin-bottom: 6px; padding: 0; list-style: none; }
.news .news-sidebar .widget .tags li a { height: 23px; line-height: 23px; float: left; border: 1px solid #eee; padding: 0 10px; border-radius: 23px; font-size: 11px; font-weight: 600; color: #99a4be; }
.news .news-sidebar .widget .tags li a:hover { background: #99a4be; border-color: #99a4be; text-decoration: none; color: #fff; }
.news .news-sidebar .widget .categories { width: 100%; float: left; margin: 0; padding: 0; }
.news .news-sidebar .widget .categories li { width: 100%; float: left; margin: 0; padding: 5px 0; list-style: none; }
.news .news-sidebar .widget .categories li span { float: right; opacity: 0.7; }
.news .news-sidebar .widget .categories li a { float: left; font-weight: 600; color: #212529; opacity: 0.7; }
.news .news-sidebar .widget .works { width: 100%; float: left; margin: 0; padding: 0; }
.news .news-sidebar .widget .works li { width: 33.33333%; float: left; padding: 5px; margin: 0; list-style: none; }
.news .news-sidebar .widget .works li a { float: left; }
.news .news-sidebar .widget .works li img { width: 100%; float: left; }

/* Testimonals */

.testimonials {background-size: contain;background-position: center;background-repeat: no-repeat;background-color: #021426;}
.section-space {padding-bottom: 80px;padding-top: 70px;}	
.testimonial-inner {position: relative;text-align: center;}
.testimonial-inner .testimonial-slider {margin: -15px;}
.testimonial-inner .star-list {margin-bottom: 10px;padding-left: 0px;}
.testimonial-inner .star-list li {display: inline-block;margin-right: 3px;}
.testimonial-inner .star-list li i {font-size: 15px;color: #179e66;}
.testimonial-inner .single-slider p {position: relative;font-size: 15px;}
.testimonial-inner .t-info {margin-top: 25px;position: relative;overflow: hidden;}
.testimonial-inner .t-left {float: left;}
.testimonial-inner .client-head {display: inline-block;float: left;}
.testimonials .section-top h3{font-size: 52px;font-weight: 600;letter-spacing: -2px;margin-bottom: 50px;background: #fff;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.testimonial-inner .t-info img {width: 75px;height: 75px;border: 2px solid #ebebeb;border-radius: 50%;padding: 3px;margin-right: 15px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
.testimonial-inner .t-left h2 {margin-top: 0;font-size: 20px;position: relative;top: 0;line-height: initial;display: inline-block;margin-top: 5px;}
.testimonial-inner .t-left h2 span {display: block;color: #555;font-size: 15px;font-weight: 400;}
.testimonial-inner .t-right .quote {color: #f3a712;float: right;z-index: 3;line-height: initial;height: 80px;font-size: 50px;}
.testimonial-inner .single-slider {position: relative;padding: 30px;background: #fff;text-align: left;-webkit-box-shadow: 0 0 15px #1010101f;-moz-box-shadow: 0 0 15px #1010101f;box-shadow: 0 0 15px #10101036;margin: 15px;}
.testimonial-slider .owl-controls .owl-dot span {background: transparent;border: 4px solid #ffffff;width: 13px;height: 13px;margin: 0;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;}
.testimonial-slider .owl-controls .owl-dot:hover span, .testimonial-slider .owl-controls .owl-dot.active span {background: transparent;border-color: transparent;background: #ffffff;}
.testimonial-slider .owl-controls .owl-dot {margin-right: 8px;}
@media only screen and (max-width: 767px){.testimonial-inner .single-slider {padding: 27px;margin: 0;box-shadow: none;}
.testimonial-inner .testimonial-slider {margin: 0;}.testimonial-slider .owl-controls .owl-dots {margin-top: 30px;}}


/* CONTACT */
.contact { width: 100%; display: flex; padding: 60px 0; text-align: center; }
.contact h5 { font-family: "Fjalla One"; font-size: 30px; color: #99a4be; }
.contact address { width: 100%; margin-bottom: 30px; }
.contact address p { opacity: 0.7; }
.contact address a { color: #57c199; font-weight: 600; }
.borderT-yellow{border-top:3px solid #f3a712}
.contact .info{padding-bottom:78px!important}
.contact .info i{font-size:20px;color:#f3a712;float:left;width:44px;height:44px;background:#fff;display:flex;justify-content:center;align-items:center;border-radius:50px;transition:all .3s ease-in-out}
.contact .info h4{padding:0 0 0 60px;font-size:22px;font-weight:600;margin-bottom:5px;color:#5f687b}
.contact .info p{padding:0 0 10px 60px;margin-bottom:20px;font-size:14px;color:#949cac}
.contact .info a{color:#949cac}
.contact .info .address:hover i,.contact .info .email:hover i,.contact .info .phone:hover i{background:#f3a712;color:#fff}
#fail,#p1,#p2,#p3,#p4,#p5,#p6{display:none;color:#dc3545;text-align:left;font-size:11px;font-weight:500}
p#returnmessage{color:#28a745;font-family:Aller-bold}

/* QUOTE BAR */
.quote-bar { width: 100%; float: left; padding: 70px 0; text-align: center; background:#fed20f; }
.quote-bar h4 { font-size: 50px; font-family: "Fjalla One"; margin-top: 0; }
.quote-bar p { padding: 0 10%;line-height: 26px; margin-bottom: 50px; }
.quote-bar .ghost-btn span { background: none; -webkit-text-fill-color: #212529; }

/* FOOTER BAR */
.footer-bar {width: 100%;float: left;background: #ffffff;padding: 50px 0;color: #000;border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
.footer-bar figure { width: 40px; float: left; margin-bottom: 0; margin-right: 15px; }
.footer-bar figure img { width: 100%; }
.footer-bar h4 { font-size: 16px; margin-top: 4px; margin-bottom: 1px; font-family: "Fjalla One"; }
.footer-bar address { display: block; font-size: 12px; font-weight: 300; margin: 0; }

/* FOOTER */
.footer {width: 100%;float: left;background: #021426;color: #fff;padding: 50px 0;text-align: center;}
.footer .logo { height: 50px; margin-bottom: 20px; }
.footer p { font-size: 13px; line-height: 17px; margin-bottom: 10px; }
.footer ul { display: inline-block; margin: 10px 0; padding: 0; }
.footer li { float: left; margin-left: 20px; padding: 0; list-style: none; }
.footer li a { color: #fff; font-size: 12px; font-weight: 600; }
.footer small { display: block; }

/* CODDLE BOX */
.coddle__box { display: block; position: relative; width: 100%; float: left; color: #fff; flex: none; perspective: 1000px; }
.coddle__box:hover { z-index: 3; }
.coddle__box:hover figure { box-shadow: 5px 20px 50px 5px rgba(0, 0, 0, 0.3); }

.coddle__box__figure .coddle__box__caption { display: none; }

.coddle__box__figure:hover .coddle__box__caption { display: block; }

.coddle__box__figure:hover .coddle__box__image { filter: brightness(0.5); -webkit-filter: brightness(0.5); }

.coddle__box__figure { margin: 0; width: 100%; height: 100%; display: block; }

.coddle__box__image { margin: 0; width: 100%; height: 100%; display: block; filter: brightness(100%); }

.coddle__box__figure > * { transform: translateZ(0px); /* Force correct stacking order */ }

.coddle__box__figure div { position: relative; }

.coddle__box__deco { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; }

.coddle__box__deco--overlay { background-image: linear-gradient(45deg, rgba(226, 60, 99, 0.4), rgba(145, 58, 252, 0.4), rgba(16, 11, 192, 0.4)); }

.coddle__box__deco--shine div { position: absolute; width: 200%; height: 200%; top: -50%; left: -50%; background-image: linear-gradient(45deg, rgba(0, 0, 0, 0.5) 0%, rgba(255, 255, 255, 0.25) 50%, transparent 100%); }

.coddle__box__caption { position: absolute; bottom: 0; width: 100%; height: 100%; padding-top: 26%; }

.coddle__box__title { margin: 0; font-weight: normal; font-size: 36px; font-family: 'Fjalla One', serif; line-height: 1; }
.coddle__box__title a { color: #fff; }
.coddle__box__title a:hover { text-decoration: none; }

.coddle__box__description { margin: 1em 0 0 0; font-size: 11px; }

/* Remove max-width on container for full-width grid */
.portfolio-gallery .container,
.portfolio-section .container {
    max-width: 100% !important;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

/* Clean Portfolio Grid: 3 cards max, responsive */
.portfolio-wrapper {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 24px;
}
.project-grid {
    /* Force a responsive multi-column layout for portfolio items. */
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    grid-gap: 28px !important;
    gap: 28px !important;
    margin-top: 48px;
    padding: 0;
    list-style: none;
    align-items: stretch;
}
.project-grid li {
    margin: 0;
    padding: 0;
    list-style: none;
    width: auto !important;
    /* make each grid item a flex column so the card can stretch to equal heights */
    display: flex;
    flex-direction: column;
    align-items: stretch;
}
/* Clean Card Design */
.project-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    overflow: hidden;
    position: relative;
    margin: 0;
    padding: 0;
    /* allow the card to grow to fill its grid cell so all cards match height */
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}
.project-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.15);
}
.project-image {
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block;
    /* keep image from stretching; it occupies its natural visual crop space */
    flex: 0 0 auto;
}

/* Ensure consistent sizing across legacy .portfolio-card img selectors */
.portfolio-card img,
.project-image {
    width: 100%;
    height: 240px; /* fixed visual crop height */
    object-fit: cover;
    display: block;
}

/* Use aspect-ratio where supported to maintain consistent crop while allowing flexibility */
@supports (aspect-ratio: 16/9) {
    .project-image, .portfolio-card img {
        height: auto;
        aspect-ratio: 16 / 9;
        width: 100%;
        object-fit: cover;
    }
}
.project-content {
    padding: 24px;
    background: #fff;
    /* let content area expand to fill remaining space inside the card */
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}
.project-title {
    font-size: 1.2rem;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px 0;
    line-height: 1.4;
}
.project-description {
    font-size: 0.95rem;
    color: #666;
    margin: 0;
    line-height: 1.5;
}
@media (max-width: 1100px) {
    .project-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
}
@media (max-width: 700px) {
    .project-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .portfolio-wrapper {
        padding: 0 16px;
    }
}

/* RESPONSIVE MEDIUM  FIXES */
@media only screen and (max-width: 1169px), only screen and (max-device-width: 1169px) { .navbar .navbar-nav { margin-left: 0; }
  .side-image-content .side-content { padding: 0 calc(25vw - 220px); }
  .main-features .feature-box { padding: 30px 10px; } }
/* RESPONSIVE TABLET FIXES */
@media only screen and (max-width: 991px), only screen and (max-device-width: 991px) { .navbar .navbar-nav { display: none; }
  .hamburger-menu-box .inner { display: none; }
  .hamburger-menu-box .menu { display: block;overflow-y: scroll;}
  .hamburger-menu-box .menu .navbar-nav { text-align: right; }
  .hamburger-menu-box .menu .navbar-nav .nav-item .nav-link { font-size: 26px; }
  .side-image-content { flex-direction: column; }
  .side-image-content .side-image { padding: 0 60px; margin: 60px 0; }
  .side-image-content .side-content { padding: 0 60px; }
  .main-features .feature-box { padding: 50px 40px; margin-bottom: 30px; }
  .recent-works .works-grid li { width: 50%; }
  .clients ul li { width: 33.33333%; }
  .recent-news .news-box { margin-bottom: 30px; }
  .recent-news .news-box figure { width: 40%; overflow: hidden; }
  .recent-news .news-box figure img { max-width: inherit; min-height: 100%; }
  .recent-news .news-box .news-content { width: 60%; }
  .news .news-sidebar { padding-left: 0; }
  .all-works .works-grid li { width: 50%; }
  .footer-bar address { margin: 15px; } }
/* RESPONSIVE MOBILE FIXES */
@media only screen and (max-width: 767px){.header {box-shadow: inset 0 0 0 1000px rgba(0,0,0,0.8);}}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) { .titles h3 { font-size: 42px; }
  .navbar .custom-btn { display: none; }
  .header .inner { width: 100%; padding: 10px 30px; left: 0;top: 22%;}
  .header .inner h2 { font-size: 3.2em; }
  .hamburger-menu-box .menu .navbar-nav .nav-item .nav-link { font-size: 17px; }
  .side-image-content .side-image .left { padding-right: 15px; }
  .side-image-content .side-image .left .small-image { margin-top: 15px; }
  .side-image-content .side-image { padding: 0 15px; }
  .side-image-content .side-content { padding: 0 15px; }
  .feeding-techius { padding: 0; padding-bottom: 60px; }
  .feeding-techius figure { margin-top: 60px; }
  .feeding-techius .odometer { margin-bottom: 0; width: 100%; float: left; }
  .main-features .feature-box { width: calc(100% - 60px); margin: 0 30px; margin-bottom: 30px; }
  .recent-works .works-grid li { width: 100%; }
  .recent-news .news-box figure { width: 100%; float: left; }
  .recent-news .news-box figure img { width: 100%; min-height: inherit; }
  .recent-news .news-box .news-content { width: 100%; }
  .clients ul li { padding: 5px; margin-top: -1px; }
  .all-works .works-grid li { width: 100%; }
  .quote-bar h4 { font-size: 44px; }
  .footer-bar { text-align: center; }
  .footer-bar figure { display: none; }
  .footer { padding-top: 60px; } }
 @media only screen and (max-width: 500px){.header .inner h2 { font-size: 2.6em; }
.titles h3 {font-size: 2.6em; text-align: center;}
.testimonials .section-top h3{font-size: 2.6em; text-align: center;}
.feeding-techius {padding-top: 20px;padding-bottom: 10px;}
.feeding-techius .odometer {margin-bottom: 10px;}
} 
/* ANIMATIONS */
@-webkit-keyframes rotate { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes rotate { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@-webkit-keyframes dash { 0% { stroke-dasharray: 1, 150; stroke-dashoffset: 0; }
  50% { stroke-dasharray: 90, 150; stroke-dashoffset: -35; }
  100% { stroke-dasharray: 90, 150; stroke-dashoffset: -124; } }
@keyframes dash { 0% { stroke-dasharray: 1, 150; stroke-dashoffset: 0; }
  50% { stroke-dasharray: 90, 150; stroke-dashoffset: -35; }
  100% { stroke-dasharray: 90, 150; stroke-dashoffset: -124; } }
@-webkit-keyframes show-img-1 { 0%,66.6% { visibility: hidden; }
  100%,66.7% { visibility: visible; } }
@keyframes show-img-1 { 0%,66.6% { visibility: hidden; }
  100%,66.7% { visibility: visible; } }
@-webkit-keyframes slide-bg-2 { 33.3% { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.05,                                 1); transform: scale(0.05, 1); }
  66.6% { -webkit-transform-origin: left center; transform-origin: left center; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  66.7% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  100% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(0, 1); transform: scale(0, 1); } }
@keyframes slide-bg-2 { 33.3% { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.05, 1); transform: scale(0.05, 1); }
  66.6% { -webkit-transform-origin: left center; transform-origin: left center; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  66.7% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  100% { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(0, 1); transform: scale(0, 1); } }
[data-aos=slide-effect] > img { -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); position: relative; }

[data-aos=slide-effect] > img { -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }

[data-aos^=slide][data-aos^=slide] { -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; }

[data-aos] { -webkit-transition-duration: 1.2s; transition-duration: 1.2s; -webkit-transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1); transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1); }

[data-aos^=slide][data-aos^=slide].animated { -webkit-transform: translate(0, 0); transform: translate(0, 0); }m

[data-aos=slide-effect].animated img { -webkit-animation-name: show-img-1; animation-name: show-img-1; }

[data-aos=slide-effect]:after { -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); }

[data-aos=slide-effect]:after { content: ' '; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.05, 0); transform: scale(0.05, 0); -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86); }

[data-aos=slide-effect].se2-white:after { background-color: #99a4be; }

[data-aos=slide-effect].animated:after { -webkit-animation-name: slide-bg-2; animation-name: slide-bg-2; }

/* Minimal Portfolio Card Styles */
.minimal-card {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #ececec;
    box-shadow: 0 2px 12px rgba(33,37,41,0.07);
    transition: box-shadow 0.22s cubic-bezier(.4,0,.2,1), transform 0.18s cubic-bezier(.4,0,.2,1);
    cursor: pointer;
    min-height: 320px;
    display: flex;
    flex-direction: column;
}
.minimal-card:hover {
    box-shadow: 0 8px 32px rgba(33,37,41,0.13);
    transform: translateY(-4px) scale(1.025);
}
.minimal-img {
    width: 100%;
    aspect-ratio: 16/10;
    height: auto;
    min-height: 180px;
    max-height: 260px;
    object-fit: cover;
    display: block;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    transition: transform 0.25s cubic-bezier(.4,0,.2,1);
}
.minimal-card:hover .minimal-img {
    transform: scale(1.04);
}
.minimal-overlay {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    background: linear-gradient(0deg, rgba(255,255,255,0.98) 80%, rgba(255,255,255,0.0) 100%);
    color: #222;
    padding: 20px 18px 12px 18px;
    width: 100%;
    min-height: 80px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    opacity: 1;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    box-shadow: none;
    pointer-events: none;
}
.minimal-title {
    font-size: 1.08rem;
    font-weight: 600;
    margin: 0 0 5px 0;
    color: #222;
    letter-spacing: 0.2px;
}
.minimal-desc {
    font-size: 0.98rem;
    color: #555;
    margin: 0;
    font-weight: 400;
    letter-spacing: 0.05px;
}

/* Portfolio Grid: Always 3 cards per row on large screens */
.portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
    margin-top: 32px;
}
@media (max-width: 1100px) {
    .portfolio-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }
}
@media (max-width: 700px) {
    .portfolio-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

/* Mobile touch & filter fixes */
html, body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* Prevent full-screen overlays from blocking touch when hidden */
.preloader, .transition-overlay, .search-box, .hamburger-menu-box {
    pointer-events: none;
}
.transition-overlay.show-me, .search-box.show-me, .hamburger-menu-box.show-me {
    pointer-events: auto;
}
.page-loaded .preloader { pointer-events: none; }

/* Make filter buttons tappable on mobile and above other content */
.works-filter { position: relative; z-index: 1200; }
.works-filter a { position: relative; z-index: 1201; touch-action: manipulation; }

/* Ensure portfolio content remains interactive */
.portfolio-gallery, .portfolio-wrapper, .project-grid { position: relative; z-index: 2; }

/* ===== Modern Portfolio gallery (moved from inline index.php/portfolio.php) ===== */
.portfolio-gallery { padding: 240px 0 40px 0; }
.portfolio-gallery .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.portfolio-title { text-align: center; font-size: 2.2rem; font-weight: 800; margin-bottom: 40px; color: #222; letter-spacing: 1px; }
.works-filter { display: flex; justify-content: center; gap: 18px; margin: 0 0 36px 0; padding: 0; list-style: none; flex-wrap: wrap; }
.works-filter li { margin: 0; }
.works-filter li a { display: inline-block; padding: 12px 32px; border-radius: 30px; background: #f1f3f6; color: #222; font-weight: 600; font-size: 1rem; text-decoration: none; box-shadow: 0 2px 12px rgba(33,37,41,0.06); transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.2s; border: none; outline: none; cursor: pointer; }
.works-filter li a.current, .works-filter li a.active { background: #212529; color: #fff; box-shadow: 0 6px 25px rgba(33,37,41,0.15); transform: translateY(-2px) scale(1.04); }
.works-filter li a:hover { background: #212529; color: #fff; box-shadow: 0 6px 25px rgba(33,37,41,0.15); transform: translateY(-2px) scale(1.04); }
.portfolio-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); grid-gap: 40px; gap: 40px; }
.portfolio-card { position: relative; border-radius: 20px; overflow: hidden; background: #fff; border: 1.5px solid #e9ecef; box-shadow: 0 2px 16px rgba(33,37,41,0.07), 0 1.5px 6px rgba(33,37,41,0.04); transition: box-shadow 0.28s cubic-bezier(.4,0,.2,1), transform 0.22s cubic-bezier(.4,0,.2,1); cursor: pointer; min-height: 340px; display: flex; flex-direction: column; }
.portfolio-card:hover { box-shadow: 0 8px 32px rgba(33,37,41,0.16), 0 4px 16px rgba(33,37,41,0.10); transform: translateY(-8px) scale(1.025); }
.portfolio-card img { width: 100%; height: 240px; object-fit: cover; display: block; border-top-left-radius: 20px; border-top-right-radius: 20px; transition: filter 0.3s, transform 0.3s; box-shadow: 0 1.5px 6px rgba(33,37,41,0.04); }
.portfolio-card:hover img { filter: brightness(0.92) saturate(1.08); transform: scale(1.03); }
.portfolio-overlay { position: absolute; left: 0; right: 0; bottom: 0; background: linear-gradient(0deg, rgba(33,37,41,0.93) 70%, rgba(33,37,41,0.0) 100%); color: #fff; padding: 28px 22px 16px 22px; width: 100%; min-height: 110px; display: flex; flex-direction: column; justify-content: flex-end; opacity: 1; transition: opacity 0.3s; pointer-events: none; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; box-shadow: 0 2px 12px rgba(33,37,41,0.10); }
.portfolio-card:hover .portfolio-overlay { opacity: 1; }
.portfolio-title-main { font-size: 1.18rem; font-weight: 700; margin: 0 0 7px 0; color: #fff; text-shadow: 0 2px 8px rgba(0,0,0,0.18); letter-spacing: 0.5px; }
.portfolio-desc { font-size: 1.01rem; color: #e9ecef; margin: 0; text-shadow: 0 1px 4px rgba(0,0,0,0.12); font-weight: 400; letter-spacing: 0.1px; }
@media (max-width: 700px) { .portfolio-title { font-size: 1.5rem; } .works-filter li a { padding: 10px 18px; font-size: 0.95rem; } .portfolio-grid { grid-template-columns: 1fr; gap: 18px; } .portfolio-card img { height: 160px; } .portfolio-overlay { padding: 18px 10px 10px 10px; } }
@media (max-width: 480px) { .works-filter { gap: 8px; } .works-filter li a { padding: 8px 10px; font-size: 0.85rem; } }

/* equal-height helpers */
.project-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 28px; }
.project-grid li { display:flex; flex-direction:column; align-items:stretch; }
.project-card { display:flex; flex-direction:column; flex:1 1 auto; }
.project-image { flex:0 0 auto; }
.project-content { flex:1 1 auto; display:flex; flex-direction:column; }